<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>动态</title>
    <link rel="stylesheet" href="semantic/semantic.css">
    <link rel="stylesheet" href="static/css/custom.css">
</head>
<body>
    <!--顶部导航-->
    <div class="ui attached secondary  stackable borderless menu ">
      <div class="left  menu">
          <a class="item brand">
            <img class="ui mini image" alt="网站图标" src="./static/image/icon.ico">
            <span class="m-text-title">大梁的博客</span>
          </a>
      </div>
      <div class="right  menu">
        <div class="item">
          <div class="ui icon input">
            <input type="text" placeholder="搜索...">
            <i class="search link icon"></i>
          </div>
        </div>
          <a class=" item m-item m-mobile-hide" href="index.html"><i class="home icon"></i>首页</a>
          <div class="ui simple dropdown item m-item  m-mobile-hide">
            <i class="idea icon"></i>分类
            <i class="dropdown icon"></i>
            <div class="menu">
              <a class="item" href="category.html">测测试分类</a>
              <a class="item" href="category.html">测试分类2</a>
              <a class="item" href="category.html">测试分类3</a>
            </div>
          </div>
          <a class="item m-item m-mobile-hide" href="tags.html"><i class="tags icon"></i>标签</a>
          <a class="item m-item m-mobile-hide" href="photos.html"><i class="images icon"></i>相册</a>
          <a class="item m-item m-mobile-hide" href="archive.html"><i class="archive icon"></i>归档</a>
          <a class="active item m-item m-mobile-hide" href="infocenter.html"><i class="rss square icon"></i>动态</a>
          <a class="item m-item m-mobile-hide" href="login.html"><i class="sign-in icon"></i>登录</a>
      </div>
    </div>
    <!--手机端-->
    <a href="#" title="缩放按钮" class="ui block icon button m-top-right m-mobile-show mobile-style">
      <i class="sidebar icon"></i>
    </a>
    <!--主要内容-->
    <div class="ui container vertical segment m-content">
          <!--使用网格 默认16份-->
        <div class="ui stackable grid">
          <div class="twelve wide column">
                <!--导航面包屑-->
                <!-- <div class="ui breadcrumb">
                    <a class="section">动态</a>
                    <div class="divider"> / </div>
                    <div class="section">全部动态</div>
                </div> -->
            <!--动态-->
            <div class="ui segment">
                <div class="ui feed">
                    <div class="event">
                      <div class="label">
                        <img alt="头像" src="./static/image/head-02.jpg">
                      </div>
                      <div class="content">
                        <div class="summary">
                          <a class="user">
                            Elliot Fu
                          </a> added you as a friend
                          <div class="date">1 小时前 </div>
                        </div>
                        <div class="meta">
                          <a class="like">
                            <i class="like icon"></i> 4 Likes
                          </a>
                        </div>
                      </div>
                    </div>
                    <div class="event">
                      <div class="label">
                        <img alt="头像" src="./static/image/head-02.jpg">
                      </div>
                      <div class="content">
                        <div class="summary"><a>Helen Troy</a> 增加 <a>2 新的 illustrations</a> <div class="date">4 天前 </div>
                        </div>
                        <div class="extra images">
                          <a> <img alt="图片" src="./static/image/bg-1.jpg"></a>
                          <a><img alt="图片" src="./static/image/bg-1.jpg"></a>
                        </div>
                        <div class="meta">
                          <a class="like">
                            <i class="like icon"></i> 1 Like
                          </a>
                        </div>
                      </div>
                    </div>
                    <div class="event">
                      <div class="label">
                        <img alt="头像"src="./static/image/head-01.jpeg">
                      </div>
                      <div class="content">
                        <div class="summary"><a class="user"> Jenny Hess </a> 将你加为好友 <div class="date">2 天前 </div>
                        </div>
                        <div class="meta">
                          <a class="like">
                            <i class="like icon"></i> 8 Likes
                          </a>
                        </div>
                      </div>
                    </div>
                    <div class="event">
                      <div class="label">
                        <img alt="头像" src="./static/image/head-01.jpeg">
                      </div>
                      <div class="content">
                        <div class="summary">
                          <a>Joe Henderson</a> posted on his page
                          <div class="date">3 天前 </div>
                        </div>
                        <div class="extra text">
                          Ours is a life of constant reruns. We're always circling back to where we'd we started, then starting all over again. Even if we don't run extra laps that day, we surely will come back for more of the same another day soon.
                        </div>
                        <div class="meta">
                          <a class="like">
                            <i class="like icon"></i> 5 Likes
                          </a>
                        </div>
                      </div>
                    </div>
                    <div class="event">
                      <div class="label">
                        <img alt="头像" src="./static/image/head-01.jpeg">
                      </div>
                      <div class="content">
                        <div class="summary"><a>Justen Kitsune</a> 上传 <a>2 张关于你的照片</a> <div class="date">4 天前 </div>
                        </div>
                        <div class="extra images">
                          <a><img alt="图片" src="./static/image/bg-1.jpg"></a>
                          <a><img alt="图片" src="./static/image/bg-1.jpg"></a>
                        </div>
                        <div class="meta">
                          <a class="like">
                            <i class="like icon"></i> 41 Likes
                          </a>
                        </div>
                      </div>
                    </div>
                  </div>
            </div>
          </div>
          <!--右侧内容-->
          <div class="four wide column">
                <div class="ui container segment">
                  <div class="ui two column centered grid">
                    <div class="center aligned column">
                      <img alt="头像" class="ui image" src="./static/image/head-02.jpg"></br>
                      <span class=" ui header">Liang</span></br></br>
                      <button class="ui blue button">关注</button>
                    </div>
                    <div class="four column centered row">
                        <div class="center aligned column"> 6
                        </br>
                          文章
                        </div>
                        <div class="center aligned column">
                          3
                          </br>
                          评论
                        </div>
                        <div class="center aligned column">
                          3
                          </br>
                          获赞
                        </div>
                    </div>
                  </div>
                  <!--分割线-->
                  <div class="ui divider"></div>
                  <i class="idea icon"></i>分类
                  
                  <div class="ui fluid vertical menu">
                      <a class="active blue item">
                        java
                        <div class="ui blue  left label">1</div>
                      </a>
                      <a class="item">
                        springboot
                        <div class="ui label">51</div>
                      </a>
                      <a class="item">
                        vue
                        <div class="ui  label">1</div>
                      </a>
                      <a class="item">
                          mysql
                            <div class="ui label">1</div>
                      </a>
                  </div>
                  <i class="tag icon"></i>标签
                  <div class="ui segment">
                    <!--参考label-->
                    <div class="ui blue labels">
                      <a class="ui label">springboot<div class="detail">1</div>
                      </a>
                      <a class="ui label">mysql<div class="detail">2</div>
                      </a>
                      <a class="ui label">Smart <div class="detail">3</div></a>
                      <a class="ui label">linux<div class="detail">22</div></a>
                      <a class="ui label">日常<div class="detail">22</div></a>
                    </div>
               </div>
                </div>
          </div>
        </div>
    </div>
    <!--底部-->
    <div class="ui  vertical footer segment">
      <div class="ui container vertical">
        <div class="ui stackable three column grid">
          <div class="center aligned column"><i class="copyright outline icon"></i>2022  &nbsp;<i class="user icon"></i>大梁</div>
          <div class="center aligned column">Powered by semantic-ui | Theme by Default </div>
          <div class="center aligned column"> ICPX备2020XXXX号</div>
        </div>
      </div>
    </div>
</body>
</html>
